<template>
	<el-dialog :title="titleMap[mode]" v-model="visible" customClass="customWidth" destroy-on-close @closed="$emit('closed')">
		<el-form :model="form" :rules="rules" :disabled="mode=='show'" ref="dialogForm" label-width="150px" label-position="left">
			<el-row :gutter="24">
				<el-col :lg="12">
					<el-form-item label="排序号" prop="sortNo">
						<el-input-number v-model="form.sortNo" placeholder="排序号" clearable maxlength="80"></el-input-number>
					</el-form-item>
				</el-col>
				<el-col :lg="12">
					<el-form-item label="客户编号" prop="customerCode">
						<el-input v-model="form.customerCode" placeholder="客户编号" clearable maxlength="80"></el-input>
					</el-form-item>
				</el-col>
			</el-row>
			<el-row :gutter="24">
				<el-col :lg="12">
					<el-form-item label="客户名称(Cn)" prop="cnName">
						<el-input v-model="form.cnName" placeholder="客户中文名称" clearable maxlength="80"></el-input>
					</el-form-item>
				</el-col>
				<el-col :lg="12">
					<el-form-item label="客户名称(En)" prop="enName">
						<el-input v-model="form.enName" placeholder="客户中文名称" clearable maxlength="80"></el-input>
					</el-form-item>
				</el-col>
			</el-row>
			<el-row :gutter="24">
				<el-col :lg="12">
					<el-form-item label="客户等级" prop="level">
						<sc-select v-model="form.level" :params="{code:'levelType'}" :apiObj="$API.crm.crmDic.getCrmDicByCode" clearable filterable style="width: 100%"></sc-select>
					</el-form-item>
				</el-col>
				<el-col :lg="12">
					<el-form-item label="客户来源" prop="source">
						<sc-select v-model="form.source" :params="{code:'sourceType'}" :apiObj="$API.crm.crmDic.getCrmDicByCode" clearable filterable style="width: 100%"></sc-select>
					</el-form-item>
				</el-col>
			</el-row>
			<el-row :gutter="24">
				<el-col :lg="12">
					<el-form-item label="企业类型" prop="customerType">
						<sc-select v-model="form.customerType" :params="{code:'customerType'}" :apiObj="$API.crm.crmDic.getCrmDicByCode" clearable filterable style="width: 100%"></sc-select>
					</el-form-item>
				</el-col>
				<el-col :lg="12">
					<el-form-item label="企业性质" prop="nature">
						<sc-select v-model="form.nature" :params="{code:'nature'}" :apiObj="$API.crm.crmDic.getCrmDicByCode" clearable filterable style="width: 100%"></sc-select>
					</el-form-item>
				</el-col>
			</el-row>
			<el-row :gutter="24">
				<el-col :lg="12">
					<el-form-item label="所属行业" prop="industry">
						<sc-select v-model="form.industry" :params="{code:'industryType'}" :apiObj="$API.crm.crmDic.getCrmDicByCode" clearable filterable style="width: 100%"></sc-select>
					</el-form-item>
				</el-col>
				<el-col :lg="12">
					<el-form-item label="当前阶段" prop="selStage">
						<sc-select v-model="form.selStage" :params="{code:'selStageType'}" :apiObj="$API.crm.crmDic.getCrmDicByCode" clearable filterable style="width: 100%"></sc-select>
					</el-form-item>
				</el-col>
			</el-row>

			<el-row :gutter="24">
				<el-col :lg="12">
					<el-form-item label="客户画像" prop="userPortrait">
						<sc-select v-model="form.userPortrait" :params="{code:'userPortrait'}" :apiObj="$API.crm.crmDic.getCrmDicByCode" clearable filterable style="width: 100%"></sc-select>
					</el-form-item>
				</el-col>
				<el-col :lg="12">
					<el-form-item label="需求产品" prop="focusProduct">
						<sc-select v-model="productId" :apiObj="$API.crm.crmProduct.getProductListForSelect" clearable filterable multiple style="width: 100%"></sc-select>
					</el-form-item>
				</el-col>
			</el-row>
			<el-row :gutter="24">
				<el-col :lg="12">
					<el-form-item label="合作意向" prop="intention">
						<el-radio-group v-model="form.intention">
							<el-radio-button label="1">强烈</el-radio-button>
							<el-radio-button label="2">一般</el-radio-button>
							<el-radio-button label="0">暂无可能</el-radio-button>
						</el-radio-group>
					</el-form-item>
				</el-col>
				<el-col :lg="12">
					<el-form-item label="竞争对手" prop="opponent">
						<el-input v-model="form.opponent" placeholder="竞争对手" clearable maxlength="80"></el-input>
					</el-form-item>
				</el-col>
			</el-row>
			<el-row :gutter="24">
				<el-col :lg="12">
					<el-form-item label="统一信用代码" prop="creditCode">
						<el-input v-model="form.creditCode" placeholder="统一信用代码" clearable maxlength="18"></el-input>
					</el-form-item>
				</el-col>
				<el-col :lg="12">
					<el-form-item label="注册资本" prop="registerCapital">
						<el-input v-model="form.registerCapital" placeholder="注册资本" clearable maxlength="80"></el-input>
					</el-form-item>
				</el-col>
			</el-row>
			<el-row :gutter="24">
				<el-col :lg="12">
					<el-form-item label="注册日期" prop="registerDate">
						<el-date-picker v-model="form.registerDate" placeholder="注册日期" type="date" value-format="YYYY-MM-DD" style="width: 100%;"></el-date-picker>
					</el-form-item>
				</el-col>
				<el-col :lg="12">
					<el-form-item label="营业期限" prop="timeOfVaildity">
						<el-date-picker v-model="form.timeOfVaildity" placeholder="营业期限" type="date" value-format="YYYY-MM-DD" style="width: 100%;"></el-date-picker>
					</el-form-item>
				</el-col>
			</el-row>

			<el-row :gutter="24">
				<el-col :lg="12">
					<el-form-item label="企业法人" prop="legalPerson">
						<el-input v-model="form.legalPerson" placeholder="企业法人" clearable maxlength="80"></el-input>
					</el-form-item>
				</el-col>
				<el-col :lg="12">
					<el-form-item label="经营状态" prop="businessStatus">
						<sc-select v-model="form.businessStatus" :params="{code:'businessStatus'}" :apiObj="$API.crm.crmDic.getCrmDicByCode" clearable filterable style="width: 100%"></sc-select>
					</el-form-item>
				</el-col>
			</el-row>

			<el-row :gutter="24">
				<el-col :lg="12">
					<el-form-item label="企业电话" prop="tel">
						<el-input v-model="form.tel" placeholder="企业电话" clearable maxlength="80"></el-input>
					</el-form-item>
				</el-col>
				<el-col :lg="12">
					<el-form-item label="企业传真" prop="fax">
						<el-input v-model="form.fax" placeholder="企业传真" clearable maxlength="80"></el-input>
					</el-form-item>
				</el-col>
			</el-row>
			<el-row :gutter="24">
				<el-col :lg="12">
					<el-form-item label="企业邮件" prop="eMail">
						<el-input v-model="form.eMail" placeholder="企业邮件" clearable maxlength="80"></el-input>
					</el-form-item>
				</el-col>
				<el-col :lg="12">
					<el-form-item label="企业网站" prop="webSite">
						<el-input v-model="form.webSite" placeholder="企业邮件" clearable maxlength="80"></el-input>
					</el-form-item>
				</el-col>
			</el-row>
			<el-form-item label="客户简介" prop="remark">
				<el-input v-model="form.remark" placeholder="客户简介" clearable maxlength="380" type="textarea"></el-input>
			</el-form-item>
		</el-form>
		<template #footer>
			<el-button @click="visible=false">取 消</el-button>
			<el-button v-if="mode!='show'" type="primary" :loading="isSaveing" @click="submit()">保 存</el-button>
		</template>
	</el-dialog>

</template>
<script>
export default {
	emits: ['success', 'closed'],
	components: {
	},
	data() {
		return {
			visible: false,
			isSaveing: false,
			mode: "add",
			titleMap: {
				add: '客户信息报备',
				edit: '编辑客户信息',
				show: '查看'
			},
			fileList:[],
			templates: [],
			productId:[],
			form: {
				customerId:'',
				sortNo:0,
				customerCode:"",
				cnName: '',
				enName: '',
				level: '',
				source:'',
				customerType:'',
				nature:'',
				industry:'',
				selStage: '',
				userPortrait: '',
				focusProduct:"",
				intention:"2",
				opponent:"",
				creditCode:"",
				registerCapital:"",
				registerDate:"",
				timeOfVaildity:"",
				legalPerson:"",
				businessStatus:"",
				tel:"",
				fax:"",
				eMail:"",
				webSite:"",
				remark:'',
			},
			rules: {
				cnName: [
					{required: true, message: '客户名称不能为空', trigger: 'blur'}
				],
				level:[
					{required: true, message: '客户等级不能为空', trigger: 'blur'}
				],
				customerType:[
					{required: true, message: '客户类型不能为空', trigger: 'blur'}
				]
			}
		}
	},
	mounted() {
	},
	methods: {
		//显示
		open(mode = 'add') {
			this.mode = mode;
			this.visible = true;
			return this
		},
		submit() {
			this.$refs.dialogForm.validate(async (valid) => {
				if (valid) {
					this.isSaveing = true;
					this.form.focusProduct = this.productId.join(",")
					var res;
					if (this.mode == "add") {
						res = await this.$API.crm.crmCustomer.insertCrmCustomerToPool.post(this.form);
					} else if (this.mode == "edit") {
						res = await this.$API.crm.crmCustomer.updateCrmCustomer.post(this.form);
					}
					this.isSaveing = false;
					if (res.code == 200) {
						this.$emit('success')
						this.visible = false;
						this.$message.success("操作成功")
					} else {
						this.$alert(res.message, "提示", {type: 'error'})
					}
				}
			})
		},
		setData(data) {
			this.form.customerId = data.customerId
			this.form.sortNo = data.sortNo
			this.form.customerCode = data.customerCode
			this.form.cnName = data.cnName
			this.form.enName = data.enName
			this.form.level = data.level
			this.form.source = data.source
			this.form.customerType = data.customerType
			this.form.nature = data.nature
			this.form.industry = data.industry
			this.form.selStage = data.selStage
			this.form.userPortrait = data.userPortrait
			this.form.focusProduct = data.focusProduct
			if(data.focusProduct!=undefined&&data.focusProduct!="")
			{
				this.productId = data.focusProduct.split(",");
			}
			this.form.intention = data.intention
			this.form.opponent = data.opponent
			this.form.creditCode = data.creditCode
			this.form.registerCapital = data.registerCapital
			this.form.registerDate = data.registerDate
			this.form.timeOfVaildity = data.timeOfVaildity
			this.form.legalPerson = data.legalPerson
			this.form.businessStatus = data.businessStatus
			this.form.tel = data.tel
			this.form.fax = data.fax
			this.form.eMail = data.eMail
			this.form.webSite = data.webSite
			this.form.remark = data.remark
		},
	}
}
</script>

<style>
.customWidth {
	width: 60%;
}
</style>
